<template>
  <el-dialog title="作废额度" :visible.sync="dialogFormVisible" append-to-body width="30%">
    <el-form ref="orderRemindBalanceForm" :model="form" :rules="rules" label-position="left">
      <el-form-item label="说明:" prop="invalidRemark">
        <el-input type="textarea" v-model="form.invalidRemark" placeholder="请输入作废额度说明"></el-input>
      </el-form-item>
      <el-form-item label="">
        <el-checkbox :checked="form.invalidFrozen" label="冻结额度若释放也将作废" :true-label="1" :false-label="2" @change="changeInvalidFrozen"></el-checkbox>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="close">取 消</el-button>
      <el-button v-loading="saveLoading" type="primary" @click="confim">确 定</el-button>
    </div>
  </el-dialog>
</template>

<script>
import * as creditApplyApi from "@/api/letterReview/creditReviewApply"

export default {
  components: {},
  props: {},
  data() {
    // 这里存放数据
    return {
      saveLoading: false,
      dialogFormVisible: false,
      form: {
        applicationNo: '',
        invalidRemark: null,
        invalidType: 2,
        invalidFrozen: 2,

      },
      rules: {
        invalidRemark: [
          {required: true, message: '请输入说明', trigger: 'change'},
        ]
      }
    }
  },
  // 方法集合
  methods: {
    confim() {
      this.$refs['orderRemindBalanceForm'].validate((valid) => {
        if (valid) {
          this.saveLoading = true
          creditApplyApi.voidOrCancelTheOrder(this.form).then(res => {
            this.$message.success('作废剩余额度成功')
            this.$emit('success')
            this.close()
          }).finally((f) => {
            this.saveLoading = false
          })
        }
      })
    },
    show(applicationNo) {
      this.dialogFormVisible = true
      this.form.applicationNo = applicationNo
    },
    close() {
      this.dialogFormVisible = false
    },
    changeInvalidFrozen(value) {
      this.form.invalidFrozen = value ? 1 : 2
    }

  },

  // 生命周期 - 挂载完成（可以访问 DOM 元素）
  mounted() {
  },

}
</script>

<style lang="scss" scoped>
</style>
